Skip to content

[#774] Restructure storyline deadline + stats into 2-col grid#780

Merged
realproject7 merged 3 commits intomainfrom
task/774-storyline-deadline-layout
Apr 2, 2026
Merged

[#774] Restructure storyline deadline + stats into 2-col grid#780
realproject7 merged 3 commits intomainfrom
task/774-storyline-deadline-layout

Conversation

@realproject7
Copy link
Copy Markdown
Owner

Summary

  • Market Cap + Supply Minted in a 2-column bordered grid
  • Deadline countdown wrapped in a full-width bordered box with "Next Plot Publish Deadline" label
  • Story complete state also in a bordered box within the same layout
  • All boxes stack vertically on mobile via space-y-2

Fixes #774

Test plan

  • Market Cap and Supply Minted side by side on desktop
  • Deadline box full-width below with proper label
  • Mobile: all boxes stack vertically
  • Story complete state displays properly
  • npm run build passes

🤖 Generated with Claude Code

- Market Cap and Supply Minted in a 2-column bordered grid
- Deadline countdown in a full-width bordered box below with
  "Next Plot Publish Deadline" label
- Story complete box also moved into the same layout section
- All boxes stack vertically on mobile via space-y-2

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 2, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
plotlink Ignored Ignored Apr 2, 2026 9:05pm

Request Review

Copy link
Copy Markdown
Collaborator

@project7-interns project7-interns left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

T2b APPROVE

Clean restructure:

  • Market Cap + Supply Minted in 2-col grid (unchanged content)
  • Deadline moved to full-width bordered box below with "Next Plot Publish Deadline" label
  • Sunset state also gets consistent bordered box styling
  • Both deadline and sunset correctly gated behind priceInfo check now (moved inside the conditional), which makes sense since they're part of the header stats section
  • Mobile stacks naturally via space-y-2

No concerns.

Copy link
Copy Markdown
Collaborator

@project7-interns project7-interns left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Verdict: REQUEST CHANGES

Summary

The bordered deadline box direction is right, but the current implementation misses the mobile layout requirement and leaves a duplicated countdown label inside the new section.

Findings

  • [medium] The stats row is still hard-coded to grid-cols-2, so on mobile the Market Cap and Supply boxes remain side by side instead of stacking vertically as the ticket requires. The issue explicitly calls for mobile to stack all boxes vertically.
    • File: src/app/story/[storylineId]/page.tsx:294
    • Suggestion: Use a responsive grid such as grid-cols-1 sm:grid-cols-2 for the stats boxes.
  • [low] The new wrapper adds a Next Plot Publish Deadline heading, but DeadlineCountdown still renders its own Deadline: label inside the box, so the UI reads like a duplicated title rather than a clean single labeled section.
    • File: src/app/story/[storylineId]/page.tsx:318
    • File: src/components/DeadlineCountdown.tsx:23
    • Suggestion: Either add a label-less mode to DeadlineCountdown for this use, or render only the countdown value inside the new bordered section.

Decision

Requesting changes because the current layout does not satisfy the mobile stacking acceptance criteria, and the deadline box copy is still redundant.

…e label

1. Grid changed to grid-cols-1 sm:grid-cols-2 so boxes stack on mobile
2. Added hideLabel prop to DeadlineCountdown to avoid redundant
   "Deadline:" text when the parent box already has a heading

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Copy link
Copy Markdown
Collaborator

@project7-interns project7-interns left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Verdict: REQUEST CHANGES

Summary

The mobile grid layout issue is fixed. The new hideLabel prop only handles the loading and expired states, so the active countdown still renders redundant Deadline: text under the new heading.

Findings

  • [medium] hideLabel is not applied in the normal countdown render path, so the storyline page still shows Next Plot Publish Deadline followed by Deadline: 6d ... for active deadlines.
    • File: src/components/DeadlineCountdown.tsx:52
    • Suggestion: Apply the same hideLabel guard in the final return branch so all countdown states render label-free when embedded under the new heading.

Decision

Requesting changes because the PR still leaves the duplicate deadline label in the common non-expired state, so the UI issue from #774 is only partially fixed.

The replace_all missed the third render branch (active countdown).
Now all three states (null, expired, active) respect hideLabel.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Copy link
Copy Markdown
Collaborator

@project7-interns project7-interns left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Verdict: APPROVE

Summary

The PR now fully matches issue #774. The stats boxes stack on mobile, and the embedded deadline countdown no longer duplicates the label under the new heading.

Findings

  • None.

Decision

Approving because the remaining deadline-label issue is fixed and the change stays focused on the requested layout restructure.

@realproject7 realproject7 merged commit 126c9d2 into main Apr 2, 2026
5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Enhancement] Storyline page: restructure deadline + stats into 2-col grid

2 participants